<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <meta name="csrf-token" content={get_csrf_token()} />

    <link phx-track-static rel="stylesheet" href={~p"/assets/app.css"} />

    <script defer phx-track-static type="text/javascript" src={~p"/assets/app.js"}>
    </script>

    <.live_title suffix=" vs Tau">
      <%= assigns[:page_title] || "Sonic Pi" %>
    </.live_title>
  </head>

  <body class="antialiased">
    <canvas id="hydra" style="position: absolute; z-index: -12"></canvas>
    <div
      id="p5sketch"
      style="position: absolute; z-index: -10 height: 100% width:100%"
      onresize="tauP5Resize"
    >
    </div>
    <div style="z-index: 1">
      <%= @inner_content %>
    </div>

    <script>
    </script>
  </body>
</html>
